<template>
<el-dialog
    v-el-drag-dialog
    custom-class="rs-dialog"
    :title="title"
    :visible.sync="dlgVisible"
    :close-on-click-modal="false"
    :before-close="()=>handleClose('cancel')"
    width="500px">
    <el-form :key="formKey" :model="form" :rules="rules" :label-width="formLabelWidth" ref="form">
        <el-form-item label="上级名称" prop="bmpmc" >
            <el-input v-model="form.bmpmc" autocomplete="off" disabled></el-input>
        </el-form-item>
        <el-form-item label="机构名称" prop="bmmc">
            <el-input v-model="form.bmmc" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="排序号" prop="bmxh">
            <el-input v-model.number="form.bmxh" autocomplete="off"></el-input>
        </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
        <el-button size="small" @click="handleClose('cancel')">取&emsp;消</el-button>
        <el-button size="small" type="primary" @click="handleClose('ok')">确&emsp;定</el-button>
    </span>
</el-dialog>
</template>
<script>
import deepmerge from 'deepmerge';
import dlg from '../../mixin/dlg';
import unitApi from '@/api/unit'
export default {
    name:"UnitForm",
    inject: ['unit'],
    mixins:[dlg],
    data(){
        return {
            formKey:0,
            formLabelWidth: '80px',
            form:{
                bmbh:'',
                bmmc:'',
                bmxh:'',
                bmpbh:'',
                bmpmc:''
            },
            rules: {
                bmmc:[
                    {required: true, message: '请输入部门名称'}
                ],
                bmxh:[
                    {required: true, message: '请输入部门序号'}
                ]
            }
        }
    },
    methods:{
        onShow(data){
            this.formKey ++;
            const {form} = this;
            if( data.bmbh ){
                this.title = "编辑"
                form.bmbh = data.bmbh;
                form.bmmc = data.bmmc;
                form.bmxh = data.bmxh;

            }else{
                this.title = "新建"
                form.bmxh = 0;
                form.bmbh = "";
                form.bmmc = "";
            }
            form.bmpbh = data.bmpbh;
            form.bmpmc = data.bmpmc;
        },
        onOk(){
            const {form,unit} = this;
            let deptData = deepmerge({},form);
            this.$refs.form.validate((valid)=>{

                if(!valid) return;

                unitApi.saveDept(deptData)
                .then(response => {
                    //console.log(response)
                    const { data } = response;
                    if( data.error_code == 0 ){
                        if(deptData.bmbh === ''){
                            deptData.bmbh = data.bmbh;
                            unit.insertNodeData(deptData);
                        }else{
                            //const node = unit.findNode(deptData.bmbh);
                            unit.saveNodeData(deptData);
                        }
                        this.closeDialog('ok');
                    }else{
                        this.$message({
                            message: data.error_code==20701?'机构已存在':data.error_desc,
                            type: 'warning'
                        });
                    }
                }).catch(error => {
                    console.log(error)
                    this.$message({message: '本地异常',type: 'warning'});
                });
            });
        }
    }
}
</script>